<template>
  <div class="tumor-form">
    <div class="tumor-tag">
      <a-tag class="status">
        {{ subject.statusname }}
      </a-tag>
    </div>
    <ol class="tumor-content">
      <li>
        <span class="one-line-title">{{ $t('all.autotext1637') }}：</span>
        <span class="one-line-elliptical">{{ subject.no }}</span>
      </li>
      <li>
        <span class="one-line-title">{{ $t('all.autotext1638') }}：</span>
        <span class="one-line-elliptical">{{ subject.sponsorName }}</span>
      </li>
      <li>
        <span class="one-line-title">{{ $t('all.autotext1639') }}：</span>
        <span class="one-line-elliptical">{{ subject.pmName }}</span>
      </li>
      <li>
        <span class="one-line-title">{{ $t('all.autotext1640') }}：</span>
        <span class="one-line-elliptical">{{ subject.createTime | moment('YYYY-MM-DD') }}</span>
      </li>
      <li>
        <a-button
          class="entry-button"
          type="primary"
          html-type="submit"
          @click="toDetail"
        >
          {{ $t('all.autotext1641') }} <a-icon type="right"/>
        </a-button>
      </li>
      <li>
        <!-- <a-upload accept=".pdf" :showUploadList="false" @change="handleChange">
          <a-button class="btn-border">点击这里上传</a-button>
        </a-upload> -->
        <!-- <pdftoimage ref="pdftoimage"></pdftoimage> -->
      </li>
    </ol>
  </div>
</template>

<script>
  
// import Pdftoimage from '@/components/Pdftoimage/pdftoimage'

export default {
  name: 'tumorIndex',
  // components: { Pdftoimage },
  props: {
    itemsInfo: { require: true }
  },
  data () {
    return {
      showPDFTOIMAGEModal: false,
      queryParam: {},
      subject: {}
    }
  },
  filters: {},
  created () {},
  mounted () {},
  computed: {},
  watch: {
    itemsInfo: {
      handler (value) {
        this.getItemsInfo(value)
      },
      deep: true
    }
  },
  methods: {
    getItemsInfo (value) {
      this.subject = { ...value, statusname: ['', this.$t('all.autotext1642'), this.$t('all.autotext1643'), this.$t('all.autotext1644')][value.status || 0] }
    },
    toDetail () {
      this.$router.push({
        name: 'Responsible'
      })
    },
    handleChange ({ file }) {
      if (file.status !== 'error') return
      this.$refs.pdftoimage.handleChange(file.originFileObj)
    }
  }
}
</script>

<style lang="less" scoped>
  .tumor-form {
    padding: 0;
    margin: 0;
    width: 100%;
    height: 100%;
    overflow-y: auto;
  }

  .tumor-tag {
    width: 100%;
    padding: 0;
    height: 20px;
    margin-bottom: 10px;
    .status{
      background-color: #E8FFFB; font-weight: 500; color:#0FC6C2;
      border-radius: 4px;
    }
  }

  .tumor-content {
    width: 100%;
    padding: 0;
    .one-line-title{
      display: inline-block;
      vertical-align: middle;
    }
    .one-line-elliptical{
      display: inline-block;
      vertical-align: middle;
      width: 70%;
      overflow: hidden;
      white-space: nowrap;
      text-overflow: ellipsis;
    }
  }

  .tumor-content li {
    line-height: 40px;
    text-align: left;
    color: #333;
    .entry-button{
      border-radius: 4px;
    }
  }
</style>
